<template>
  <layout>
    <div class="container">
      <el-breadcrumb separator="/">
      <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item><a>我的留言</a></el-breadcrumb-item>
    </el-breadcrumb>
    <el-row :gutter="20" class="mt-20">
      <el-col :span="8" :offset="0" class="flexCenter">
        <span class="label">姓名</span>
        <el-input v-model="form.name" label="" placeholder="请输入名称">
        </el-input>
      </el-col>
      <el-col :span="8" :offset="0"  class="flexEnd">
        <el-button type="primary" size="" @click="">查询</el-button>
        <!-- <el-button type="" size="" @tap.stop="$tools.jump('/pages/article/add')">添加</el-button> -->
      </el-col>
    </el-row>
    <div class="table mt-20">
      <el-table
        :data="tableData"
        style="width: 100%"
        height="250">
        <el-table-column
          prop="create_time"
          label="创建时间"
          width="">
        <template slot-scope="scope">
          {{ parseTime(scope.row.create_time) }}
        </template>
      </el-table-column>
        <el-table-column
          prop="username"
          label="姓名"
          width="">
        </el-table-column>
        <el-table-column
          prop="phone"
          label="电话"
          width="">
        </el-table-column>
        <el-table-column
          prop="email"
          label="邮箱"
          width="">
        </el-table-column>
        <el-table-column
          prop="operate"
          label="操作"
          width="120">
          <template slot-scope="scope">
          <el-tooltip content="修改" placement="top" effect="dark">
            <el-link type="primary"  @tap.stop="$tools.jump('/pages/myMessage/add?id='+scope.row._id+'&table=message')"><i class="el-icon-edit"></i></el-link>
          </el-tooltip>
          <!-- <el-tooltip content="删除" placement="top" effect="dark">
            <el-link type="primary" style="margin-left:10px;"><i class="el-icon-delete"></i></el-link>
          </el-tooltip> -->
        </template>
        </el-table-column>
      </el-table>
    </div>
  </div>
  </layout>
</template>

<script>
import layout from '@/layout/index.vue'	
export default {
  components: {layout},
  data () {
      return {
        form:{},
        typeList:[
          {label:'心情随笔',value:'note'},
          {label:'韶华追忆',value:'memory'},
          {label:'个人作品',value:'works'},
        ],
        tableData:[]
      };
  },
  onLoad () {
    this.getList()
  },
  methods: {
     // 列表
    getList(){
      const that = this
      const data={
        table:'message'
      }
      this.$Ajax('getLists',data,res=>{
        console.log(res.data)
        that.tableData = res.data
      })
    },
  },
};
</script>

<style scoped>
.container{
max-width: 1000px;
margin: 20px auto;
}
.flexCenter{
display: flex;
align-items: center;
align-content: center;
}
.flexEnd{
display: flex;
justify-content: flex-end;

}
.label{
display: inline-block;
width: 100px;
}

</style>
